import { useEffect, useState } from "react"
import { Switch, useHistory, useParams } from "react-router-dom/cjs/react-router-dom.min"
import XzqhHandle from "../../../../../../utils/apis/XzqhHandle";
import { Card, Form, Input, Select, Button, App, message,DatePicker } from "antd";
import FetchHelper from "../../../../../../utils/helper/fetch-helper";

export default function XzqhEdit() {
    const id = useParams()?.id
    const [xzqhIdDatas, setXzqhDatas] = useState();
    const [xzqhDynamicForm, setxzqhDynamicForm] = useState();
    const [form] = Form.useForm();
    const history = useHistory();
    const [date, setDate] = useState();

    useEffect(() => {
        XzqhHandle.xzqhIdDataApi(id).then(resp => {
            setXzqhDatas(resp.data)
            form.setFieldsValue({
                ...resp.data
            })
        })
    }, [id, form])
    useEffect(() => {
        XzqhHandle.xzqhEditDynamicApi().then(datas => {
            setxzqhDynamicForm(datas)
        })
    }, [])

    //保存
    const onFinish = (values) => {
        console.log('values',values.lrsj=date,date)
        for (const key in xzqhIdDatas) {
            if (values.hasOwnProperty(key)) {
                xzqhIdDatas[key] = values[key]
            }
        }
        FetchHelper.putJson(`/admin-api/ybyj/xzqh`, xzqhIdDatas).then(resp => {
            if (resp.code === 200) {
                message.success("修改成功");
                history.push(`/manager/xzqh`)
            } else {
                message.error("修改失败!" + resp.msg);
            }

        })
            .catch(err => {
                message.error("修改失败: " + err.message); // 显示具体错误信息
            });
    }
    //返回按键
    const quxiaoHandle = () => {
        history.push(`/manager/xzqh`)
    }
    return <div className="layout-h100 fill" style={{
        overflow: "scroll"
    }}>
        <Card className="layout-h" >
            <header style={{
                fontSize: 20,
                fontWeight: "bold"
            }}>行政区划编辑</header>
            <hr />
            <Form method="post" form={form} onFinish={onFinish}
                style={{
                    flex: "flex",
                    flexWrap: "wrap",
                    height: "1000px"
                }}

            >
                <div className="InputForm">
                    {xzqhIdDatas !== undefined && xzqhDynamicForm !== undefined && xzqhDynamicForm.map((formItem) => {
                        let node;
                        switch (formItem.type) {
                            case 'header':
                                node = <><header></header></>;
                                break;
                            case 'datePicker':
                                node = <><DatePicker 
                                showTime 
                                format="YYYY-MM-DD HH:mm:ss" 
                                //placeholder={field.alias} 
                                onChange={(date, dateString)=>{
                                    //console.log('on',date, dateString)
                                    setDate(dateString)
                                }}
                              /></>;
                                break;
                            case 'input':
                            default:
                                node = <Input style={{
                                    width: "90%"
                                }}></Input>
                        }
                        return <div style={{
                            flexBasis: "33%",
                            marginBottom: "10px"
                        }}>
                            <Form.Item
                                label={formItem.alias}
                                name={formItem.name}

                            >
                                {node}
                            </Form.Item>
                        </div>
                    })}</div>
                <div className="layout-h">
                    <Button className="btn1" type="primary"
                        htmlType="submit"
                    >保存</Button>

                    <Button onClick={quxiaoHandle} className="btn2">返回</Button>
                </div>
            </Form>
        </Card>
    </div>
}